<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="/favicon.ico" >
    <link rel="Shortcut Icon" href="/favicon.ico" />
    <!--[if lt IE 9]-->
    <script type="text/javascript" src="lib/html5shiv.js"></script>
    <script type="text/javascript" src="lib/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="lib/select2/select2.min.css">
    <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
    <!--<link rel="stylesheet" type="text/css" href="http://cdn.amazeui.org/amazeui/2.7.2/css/amazeui.css" />-->

    <!--[if IE 6]-->
    <script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <!--/meta 作为公共模版分离出去-->
    <title>新增接口</title>
    <!--<style type="text/css">
        .select2-container .select2-selection&#45;&#45;single{
            border: solid 1px #ddd;
            color:#000000;
            border-radius: unset;
            height:32px;
            line-height: 32px;
        }
    </style>-->
</head>
<body>
<article class="page-container">
    <form  method="post" class="form form-horizontal" id="form-admin-role-add">
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>服务：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select class="select" size="1" name="serviceid" id="serviceid">
                        <option value="" selected>请选择服务</option>
                    </select>
				</span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>接口地址：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="" id="iuri" name="iuri">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">接口方法：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="soap接口必传" id="soapAction" name="soapAction">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>接口描述：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="" id="remark" name="remark">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">请求方式：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select class="select" size="1" name="irequestmethod" id="irequestmethod">
                    </select>
				</span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">iContentType：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select class="select" size="1" name="icontenttype" id="icontenttype">
                    </select>
				</span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">示例Header：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <textarea id="iheadersample" name="iheadersample" cols="" rows="" class="textarea valid" placeholder="请输入示例Header..."></textarea>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">请求参数类型：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select class="select" size="1" name="iparamtype" id="iparamtype" onchange="request1()">
                    </select>
				</span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">请求参数示例：</label>
            <div id="request1" class="formControls col-xs-8 col-sm-9">
                <textarea id="iparamsample" name="iparamsample" cols="" rows="" class="textarea valid" placeholder="请输入示例参数..."></textarea>
            </div>
            <div id="paramInput1" class="formControls col-xs-8 col-sm-9" hidden>
                <table id="paramTable" style="width: 86%;">
                    <tr>
                        <td style="width: 30%;"><input type="text" class="input-text" value="" placeholder="key" id="key1" name="key1"></td>
                        <td style="width: 55%;">
                            <input type="text" class="input-text" value="" placeholder="value" id="value1" name="value1">
                            <a href="javascript:;" onclick="addInput()"><i class="Hui-iconfont">&#xe600;</i></a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">返回值类型：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select class="select" size="1" name="iresponsetype" id="iresponsetype">
                    </select>
				</span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>接口开发人员：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select class="select" size="1" name="idev" id="idev">
                        <option value="" selected>请选择</option>
                    </select>
				</span>
            </div>
        </div>
        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                <button type="button" class="btn btn-success radius" id="admin-role-save" name="admin-role-save" onclick="addTi()"><i class="icon-ok"></i> 提交</button>
                <button type="button" class="btn btn-success radius" id="admin-role-close" name="admin-role-close" onclick="layer_close()"><i class="icon-ok"></i> 关闭</button>
            </div>
        </div>
    </form>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/select2/select2.full.js"></script>
<script type="text/javascript" src="lib/select2/pinyin.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script>
<!--<script type="text/javascript" src="http://cdn.amazeui.org/amazeui/2.7.2/js/amazeui.js"></script>-->
<script type="text/javascript">

    //loading
    $(function () {

        $.ajaxSetup({
            layerIndex:-1,
            beforeSend: function () { //插件加载前
                this.layerIndex = layer.load(1, { shade: [1.01, '#fff'] });
                $('#admin-role-save').val("正在提交请稍等...")
            },
            complete: function () { //完成加载后执行
                layer.close(this.layerIndex); //完成加载后关闭loading
            },
            error: function () { //报错时执行
                layer.alert('显示异常，请刷新后重试', {
                    icon: 0,
                    skin: 'layer-ext-moon'
                });
            }
        });
    });

    function devGroup(){
        var dev=null;
        var groupId=$.cookie('groupidCookie');
        $.ajaxSetup({async : false});
        $.ajax({
            type: "post",
            url: "/user/selectDever",
            data: {
                groupId:groupId
            },
            dataType: "json",
            success: function (data) {
                var status=data.status;
                var msg=data.msg;
                if(status == 0){
                    dev=data.data;
                }else{
                    layer.alert(msg, {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    })
                }
            },
            fail:function (data) {
                layer.alert(JSON.stringify(data), {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    });
            },
            error: function(xhr) {
                layer.alert('Error' + JSON.stringify(xhr), {
                        icon: 2,
                        skin: 'layer-ext-moon'
                    })
            }
        });
        return dev;
    }

    //下拉相关数据获取
    $(document).ready(function () {
        $.ajax({
            type: "post",
            url: "/tservice/selectByCondition",
            data: {
                pageNum:1,
                pageSize:1000
            },
            dataType: "json",
            success: function (data) {
                var status=data.status;
                var msg=data.msg;
                var list=data.data.list;
                if(status == 0){
                    var html="";
                    for(i=0;i<list.length;i++){
                        var row=list[i];
                        var rowHtml="<option value=\""+row.id+"\">"+row.servicekey+"</option>";
                        html=html+rowHtml;
                    }
                    $("#serviceid").append(html);

                }else{
                    layer.alert(JSON.stringify(data), {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    });
                }

            },
            fail:function (data) {
                layer.alert(JSON.stringify(data), {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    });
            },
            error: function(xhr) {
                layer.alert('Error' + JSON.stringify(xhr), {
                        icon: 2,
                        skin: 'layer-ext-moon'
                    })
            }
        });

        $.ajax({
            type: "get",
            url: "/enum/allEnum",
            data: {
            },
            dataType: "json",
            success: function (data) {
                var RequestMethodTypeEnum=data.RequestMethodTypeEnum;
                var html="";
                for(i=0;i<RequestMethodTypeEnum.length;i++){
                    var row=RequestMethodTypeEnum[i];
                    var rowHtml="<option value=\""+row.id+"\">"+row.value+"</option>";
                    html=html+rowHtml;
                }
                $("#irequestmethod").append(html);

                var ContentTypeEnum=data.ContentTypeEnum;
                var html1="";
                for(i=0;i<ContentTypeEnum.length;i++){
                    var row=ContentTypeEnum[i];
                    var rowHtml="<option value=\""+row.id+"\">"+row.value+"</option>";
                    html1=html1+rowHtml;
                }
                $("#icontenttype").append(html1);

                var ResponseTypeEnum=data.ResponseTypeEnum;
                var html2="";
                for(i=0;i<ResponseTypeEnum.length;i++){
                    var row=ResponseTypeEnum[i];
                    var rowHtml="<option value=\""+row.id+"\">"+row.value+"</option>";
                    html2=html2+rowHtml;
                }
                $("#iparamtype").append(html2);
                $("#iresponsetype").append(html2);

            },
            fail:function (data) {
                layer.alert(JSON.stringify(data), {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    });
            },
            error: function(xhr) {
                // report error
                layer.alert('Error' + JSON.stringify(xhr), {
                        icon: 2,
                        skin: 'layer-ext-moon'
                    })
            }
        });

        var dev=devGroup();
        var htmldev="";
        for(var i=0;i<dev.length;i++){
            var row=dev[i];
            var rowHtml="<option value=\""+row.realname+"\">"+row.realname+"</option>";
            htmldev=htmldev+rowHtml;
        }
        $("#idev").append(htmldev);
        $("#idev").select2();


    });

    //根据请求参数类型判断请求参数实例展示方式
    function request1(){
        var iparamtype = $("#iparamtype").val();
        if(iparamtype == 2){
            document.getElementById("request1").style.display = "none";
            document.getElementById("paramInput1").style.display = "block";
        }else{
            document.getElementById("request1").style.display = "block";
            document.getElementById("paramInput1").style.display = "none";
        }

    }

    //请求参数实例动态增加输入框处理
    function addInput(){
        var rows=document.getElementById("paramTable").rows.length;
        var row=rows+1;
        var html="<tr id='tr"+row+"'>\n" +
            "                        <td style='width: 30%'><input type=\"text\" class=\"input-text\" value=\"\" placeholder=\"key\" id=\"key"+row+"\" name=\"key"+row+"\"></td>\n" +
            "                        <td style='width: 55%;'>\n" +
            "                            <input type=\"text\" class=\"input-text\" value=\"\" placeholder=\"value\" id=\"value"+row+"\" name=\"value"+row+"\">\n" +
            "                            <a href=\"javascript:;\" onclick=\"addInput()\"><i class=\"Hui-iconfont\">&#xe600;</i></a><a href='javascript:;' onclick='clearInput("+row+")'><i class=\"Hui-iconfont\">&#xe6a1;</i></a>\n" +
            "                        </td>\n" +
            "                    </tr>";

        $("#paramTable").append(html);

    }

    //动态减少输入框处理
    function clearInput(row){
        document.getElementById("tr"+row).remove();

    }

    //添加接口
    function addTi(){
        var serviceid = $("#serviceid").val();
        var iuri = $("#iuri").val();
        var soapAction = $("#soapAction").val();
        var remark = $("#remark").val();
        var irequestmethod = $("#irequestmethod").val();
        var iheadersample= $("#iheadersample").val();
        var icontenttype = $("#icontenttype").val();
        var iparamtype = $("#iparamtype").val();
        var iparamsample;
        if(iparamtype == 2){

            var table=document.getElementById("paramTable");
            var rows=table.rows;
            var json;

            json = "{";
            for(i=0;i<rows.length;i++){
                var rowList=rows[i].getElementsByTagName("input");
                if(rowList[0].value.length>0 || rowList[1].value.length>0){
                    var key=rowList[0].value;
                    var value=rowList[1].value;
                    json+='\"'+key+'\"'+':\"'+value+'\",';
                }

            }
            if(json.length>1){
                json = json.substring(0, json.length-1);
            }

            json+="}";
            iparamsample=json;

        }else{
            iparamsample = $("#iparamsample").val();
        }

        var iresponsetype = $("#iresponsetype").val();
        var idev = $("#idev").val();


        if(serviceid == null || serviceid == ""){
            layer.msg("请选择服务！");
            return;
        }else if(iuri == null || iuri == ""){
            layer.msg("接口地址不能为空！");
            return;
        }else if(remark == null || remark == ""){
            layer.msg("接口描述不能为空！");
            return;
        }else if(idev == null || idev == ""){
            layer.msg("开发人员能为空！");
            return;
        }else{
            $.ajax({
                type: "post",
                url: "/ti/insertOne",
                data: {
                    serviceid:serviceid,
                    iuri:iuri,
                    soapAction:soapAction,
                    remark:remark,
                    irequestmethod:irequestmethod,
                    iheadersample:iheadersample,
                    icontenttype:icontenttype,
                    iparamtype:iparamtype,
                    iparamsample:iparamsample,
                    iresponsetype:iresponsetype,
                    idev:idev,
                    istatus:1
                },
                dataType: "json",
                success: function (data) {
                    var status=data.status;
                    var msg=data.msg;
                    if(status == 0){
                        //parent.window.location.reload();
                        window.parent.pageSkip(1);
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    }else{
                        layer.alert(msg, {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    });
                    }

                },
                fail:function (data) {
                    layer.alert(JSON.stringify(data), {
                        icon: 0,
                        skin: 'layer-ext-moon'
                    });
                },
                error: function(xhr) {
                    // report error
                    layer.alert('Error' + JSON.stringify(xhr), {
                        icon: 2,
                        skin: 'layer-ext-moon'
                    })
                }
            });
        }

    }
</script>

</body>
</html>